<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html> 
<head>
<%@ include file="/WEB-INF/jsp/include/easyui.jsp" %>
<%@ include file="/WEB-INF/jsp/include/pForm.jsp" %>
<%@ include file="/WEB-INF/jsp/include/easyui-layui-upload.jsp" %>
<title>工程支出流程详情查看</title>
</head>
<body>
	<div id="tt" class="easyui-tabs" style="width:100%;height:250px;" fit="true">   
    <div title="工程支出表单" style=";display:none;">   
       <div class="easyui-panel" title="" data-options="fit:true,border:false" style="padding:10px;">
		<!-- 替换自动form表单 -->
		<form id="easyuiForm" method="post" action="#" style="min-width: 800px;width:100%;"   >
		 <!--类名属性及默认主键id-->
		 <input type="hidden" name="className" value=""  />
		 <input type="hidden" name="id" value="" />
		 <input type="hidden" name="createrId" value="${SESSION_USER.user.id}" />
		 
		 <div style="margin-bottom:20px">
		  	<input  class="easyui-textbox"  name="expenseNo" style="width:260px;" readonly="readonly" data-options="label:'单据编号:',required:true,prefix:'ZC',timestamp:'yyMMddHHmmss' "/>
		  	<input class="easyui-datebox easyui-validatebox" id="applyDate" name="applyDate" style="width:260px;" data-options="label:'申请日期:',required:true" />
		  	<input class="easyui-textbox easyui-validatebox" name="pm"  value="${SESSION_USER.user.nickName}" style="width:260px;" data-options="label:'申请人:',required:true,validType:'length[0,15]'" />
		 </div>
		 
		  <div style="margin-bottom:20px">
		 		<select class="easyui-combobox"   name="department" style="width:260px;" data-options="label:'关联项目部:',required:true,loadFilter:fn.departmentFilter" 
					url="/console/combobox?valueField=dicName&textField=dicName&modleName=dictionary&pCode=A5&pCode_searchType=eq" >
		    	</select>
		    	<select class="easyui-combobox" name="contractName" style="width:520px;" data-options="label:'合同名称:'" 
					url="/console/contract/combobox?textField=contractName&valueField=contractName" >
			   </select>
		  	</div>
		  	
		 	<div style="margin-bottom:20px">
		 		<input class="easyui-textbox easyui-validatebox" name="remark" multiline="true" style="width:780px;height:100px;" data-options="label:'备注:',required:false,validType:'length[0,500]'" />
		 	</div>
		 
		 <div style="margin-bottom:20px">
		 		<input class="easyui-layuiupload" name="attachment" style="width:780px;" data-options="label:'附件:',upload:{auto:false,height:150,readonly:true}" />
		 </div>
		 
		  <!-- 支付明细 -->
		 	<div style="margin-bottom:20px;margin-left: 80px;">
				<table id="dataGrid" title="支付明细" style="height:260px;width:80%;"></table>
			</div>
		 
		</form>
	</div>    
    </div>   
    <div title="批注信息" data-options="" style="overflow:auto;padding:20px;display:none;">   
       <!-- 流程批注及提交处理 -->
		 <div style="margin-bottom:20px;margin-left: 90px;">
		 	<table id="commentGrid" title="批注信息列表"   style="height:210px;width: 630px;"></table>  
		</div>
    </div>   
    <div title="流程图" data-options="" style="padding:20px;display:none;">   
        <iframe id="flowImage" style="width:98%;height:98%;border:0"></iframe> 
    </div>   
</div>  

	
</body>
<script>
$(function(){
	fn.resetForm();
	var data = fn.getDialogData();
	
	if( data.processInstanceId &&  data.processInstanceId!=''){
		$("#flowImage").attr("src",'/console/activiti/viewImageByInstId?instId='+ data.processInstanceId);
	}
	
	$("#dataGrid").datagrid({
		idField: "id",
		rownumbers: true,
		pagination: true,
		singleSelect: true, 
		showFooter: true,
		nowrap:false,
		url : '/console/com.fs.jzzn.pojo.ExpenseItem/list',
		queryParams: {
			expenseNo :data.expenseNo,
			expenseNo_searchType: "eq"
		},
		fitColumns:true,
		columns : [[
		    	 {field: 'costUser', title: '支出对象', width: 80,editor:{
					 type:'combobox',
						options:{
							method:'get',
							url:'/console/combobox?valueField=nickName&textField=nickName&modleName=user',
							required:true
						}
				 }}
		    	,{field: 'remark', title: '标题说明', width: 200,editor:'textbox'}
			    ,{field: 'costType', title: '类别', width: 80,editor:{
			    	type:'combobox',
					options:{
						method:'get',
						url:'/console/combobox?valueField=dicName&textField=dicName&modleName=dictionary&pCode=B1&pCode_searchType=eq',
						required:true
					}
			    }}
		    	,{field: 'money', title: '金额(元)', width: 80,editor:{type:'numberbox',options:{precision:2}}}
		    	,{field: 'billsNo', title: '凭单号', width: 100,editor:'textbox'}
		    	,{field: 'pNo', title: '路段编号', width: 90,editor:{
			    	type:'combobox',
					options:{
						method:'get',
						url:'/console/combobox?valueField=pNo&textField=pRoad&modleName=project'
					}
			    }}
		    	,{field: 'department', title: '关联项目部', width: 130,editor:{
			    	type:'combobox',
					options:{
						method:'get',
						url:'/console/combobox?valueField=dicName&textField=dicName&modleName=dictionary&pCode=A5&pCode_searchType=eq'
					}
			    }}
		    	,{field: 'costDate', title: '日期', width: 100,editor:{
			    	type:'datebox'
			    }}
		    	//,{field: 'opt', title: '操作', width: 50}
		]],
		onLoadSuccess:function(){
			childTotal();
		},
		onAfterEdit:function(index, row, changes){
			$.each(['remark','costType','billNo'], function (i,item) {
				$("td[field="+ item +"] div").tooltip({ content: function(){ return $(this).text(); } });
			});
			childTotal();
		}
	});
	
	function childTotal(){
		var dData = $('#dataGrid').datagrid('getData');
		var total = {money: 0, costType: '合计：'};
		$.each(dData.rows ||[], function (i,item) {
			total.money += parseFloat(item.money || '0');
		});
		total.money = total.money.toFixed(2);
		$('#dataGrid').datagrid('reloadFooter',[ total ]);
	}
	
	
	/*批注数据加载*/
	$('#commentGrid').datagrid({    
	    url :'/console/activiti/comment/commentList',
		queryParams:{
			processInstanceId: data.processInstanceId 
		},
	    columns:[[    
	        {field:'time',title:'时间',width:130},    
	        {field:'userId',title:'批注人',width:130},    
	        {field:'fullMessage',title:'批注信息',width:'50%'}    
	    ]]    
	});  
});
</script>
</html>